<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
    </head>
    <body>



一边规定另一边自适应
    方法1：
        左边：width:100px;float:left
        右边：margin-left:100px
    方法2：
        左边：width:100px;float:left
        右边：padding-left:100px;width:100%;box-sizing:border-box
    方法3：
        左边：width:100px;position:absolute;
        右边：padding-left:100px;width:100%;box-sizing:border-box

    box-shadow: X  Y  模糊值  放大值  颜色   inset
    text-shadow:X  Y  模糊值   颜色

    overflow: hidden;          超出隐藏
    text-overflow: ellipsis;   超出打省略号
    white-space: nowrap;       超出不换行

news模块
    0-768        @media  screen  and  (max-width:768px){  li{width:25%;magin:20px  10px}}
    768-992      @media  screen  and  (min-width:768px)  and  (max-width:992px){  li{magin:20px  30px}}
    >992         col-md-
    </body>
</html>